<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0" />
    <title>沃闪购</title>
    <link rel="icon" href="../img/bitbug_favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="../css/normalize.css" />
    <!--<link rel="stylesheet" href="index.css"/>-->
    <!--<link rel="stylesheet" href="../index.css"/>-->
    <link rel="stylesheet" href="../index_format.css" />
    <link rel="stylesheet" href="../css/layer.css" />

    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/rem.js"></script>
    <script type="text/javascript" src="../js/tool.js"></script>
    <script type="text/javascript" src="../js/clipboard.min.js"></script>
    <script src="../js/iscroll.js"></script>
    <script type="text/javascript">
        var myScroll;

        function loaded() {
            myScroll = new IScroll('#wrapper', {
                bounce: false,
                bounceEasing: 'elastic',
                bounceTime: 200
            });

            myScroll.on('scrollStart', scrollF);
        }

        function scrollF() {
            console.log('hide');
            var height_ul = $('.product-list').height();
            var height_btn = $('.front-next').height();
            var scrolH = height_ul + height_btn;
            console.log(scrolH);
            $('.btn-group').insertBefore('.order-link');
            $('.wo-topic').hide(500)
            $('.container').css({
                height: "85%"
            });
            $('#wrapper').css({
                height: "6.4rem"
            })
        }

        function scrollEndF() {
            console.log('show');
            // $('.header').show()
            $('.wo-topic').show(500)
            $('.container').css({
                height: "75%"
            });
            $('#wrapper').css({
                height: "3.2rem"
            })
        }
        document.addEventListener('touchmove', function(e) {
            e.preventDefault();
            scrollF();
        }, false);
    </script>
</head>

<body onload="loaded()">
    <div class="header">
        <div><img src="../img/wo-logo.png" alt="" /></div>
        <div class="wo-topic"></div>
    </div>
    <div class="container n-bor">
        <div class="flex-box">
            <div class="choose-info">
                <div class="user-info">
                    <p><img id="user_img" alt="" /></p>
                    <p><span id="user_id" </p>
                    <!-- <p><span id="user_id"></span><a href="login.html">退出</a></p>
                    <p><span>审核状态：</span><i id="user_state" class=""></i></p>
                    <p><span>归属店：</span><i id="user_channel"></i></p> -->
                    <!-- <a id="refresh" href="#" class="refresh"></a> -->
                </div>
                <p class="list-name"><span>可用提现佣金为：</span><span><i id="total_cash" ></i>元</span> <a href="draw_cash.html">立即提现</a></p>
                <div id="wrapper" class="product-container">
                    <ul class="product-list">
                        <li>
                            <img class="pro-img" src="../img/201712_06.png" alt="">
                            <ul class="pro-ul">
                                <li><span>产品名称：</span><span>本地冰淇淋</span></li>
                                <li><span>预存金额：</span><span></span></li>
                                <li><span>套餐金额：</span><span></span></li>
                            </ul>
                            <a href="mycode.html" class="pro-cash">营销二维码</a>
                        </li>
                        <li>
                            <img class="pro-img" src="../img/201712_06.png" alt="">
                            <ul class="pro-ul">
                                <li><span>产品名称：</span><span>本地冰淇淋</span></li>
                                <li><span>预存金额：</span><span></span></li>
                                <li><span>套餐金额：</span><span></span></li>
                            </ul>
                            <a href="mycode.html" class="pro-cash">营销二维码</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <script>
        // $('header').on('touchstart', function(event) {
        //     event.preventDefault();
        //     event.stopPropagation();
        //     return false;
        // })
        // $('.product-container').on('touchmove', function() {
        //     return true;
        // })
    </script>
    <script type="text/javascript" src="../js/layer.js"></script>

    <script>
        var bes_poster = {
            user_info: '.user-info',
            user_img: "#user_img",
            user_id: '#user_id',
            user_state: '#user_state',
            user_channel: '#user_channel',
            refresh: "#refresh",
            turn_page_fr: '#turn_page_fr',
            turn_page_th: '#turn_page_th',
            count: 0,
            host_server: getServerHost(),
            info_url: '/api/shopping/userInfo?',
            product_url: '/api/shopping/queryOrderList',
            front_next: '.front-next',
            need_name: ".need_name_fr",
            need_time: '.need_time_fr',
            total_cash: '#total_cash',
            need_status: '.need_status_fr',
            order_status_ok: "已完成",
            order_status_no: "未完成",
            product_list: '.product-list',
            btn_group: '.btn-group',
            btnCopy: '.btnCopy',
            product_status: ["", "待支付", "已取消", "支付成功", "已发货", "已确认收货", "订单完成", "申请退款", "已退款",
                "等待开卡写卡", "等待外呼", "外呼完成", "物流发货", "活体认证", "激活完成", "订单中心处理", "订单中心已撤单"
            ],
            init: function() {
                // this.refreshBtn();
                this.getInfo();
                // this.userInfo();
                this.getNeeds()
                this.btnclick();
                // this.copyUrl();
            },
            // copyUrl: function() {
            //     var context = this;
            //     $(context.btnCopy).click(function() {
            //         location.href = "http://o2o2.unisk.cn:8081/console/system/toLogin.do"
            //     })
            // },
            userInfo: function(id, name, status) {
                var context = this;
                //console.log(id, name, status)
                if (id) {
                    $(context.user_img).attr('src', "../img/user.png");
                    $(context.user_id).html(id);
                    $(context.user_id).attr("data-id", id);
                    if ('1' == status) {
                        $(context.user_state).attr('class', 'red-info').html('未审核');
                        $(context.btn_group + " a:first-child").attr('href', '#').attr("class", "btn-style btn-false");

                    } else if ('2' == status) {
                        $(context.user_state).attr('class', 'green-info').html('已通过');
                        $(context.btn_group + " a:first-child").attr('href', './mycode.html').attr("class", "btn-style btn-ok");
                    } else if ('3' == status) {
                        $(context.user_state).attr('class', 'red-info').html('已冻结');
                        $(context.btn_group + " a:first-child").attr('href', './mycode.html').attr("class", "btn-style btn-false");
                    } else {
                        console.log(status)
                    }
                    $(context.user_channel).html(name);
                } else {
                    console.log('no get info')
                }
            },
            refreshBtn: function() {
                var context = this;
                $('#refresh').click(function(e) {
                    e.preventDefault();
                    $(this).addClass('active');
                    var self = this;
                    var timer = setTimeout(function() {
                        $(self).removeClass('active');
                        window.location.reload();
                        timer = null;
                        clearTimeout(timer);
                    }, 2000);
                    //                context.userInfo();
                })
            },
            //获取个人信息
            getInfo: function() {
                var context = this;
                var data = JSON.parse(sessionStorage.getItem('res'));
                setTimeout(function() {
                    $.ajax({
                        type: 'GET',
                        url: context.host_server + context.info_url,
                        data: "userId=" + data.userId,
                        success: function(response) {
                            var res = response.res;
                            if ('200' == response.code) {
                                context.userInfo(res.account_no, res.channel_name, res.status);

                            } else {
                                layer_msg('获取用户信息失败')
                            }

                            //                            context.showNeeds(context.count, response);
                        },
                        error: function() {
                            layer_msg(' 返回数据出现异常');
                        }
                    });
                    //                获取用户信息
                }, 1000)


            },
            //获取商品信息
            getNeeds: function() {
                var context = this;
                var orderList = {
                    accountNo: sessionStorage.getItem('accountNo'),
                };
                console.log(orderList);
                // $(context.front_next).css("display", "block");
                $.ajax({
                    type: 'POST',
                    // url: context.host_server + context.product_url,
                    url: '../json/product.json',
                    data: JSON.stringify(orderList),
                    contentType: "application/json;charset=UTF-8",
                    dataType: "json",
                    success: function(response) {
                        if ('200' == response.code) {
                            var res = response.res.product;
                            var total_cash = response.res.total;
                            console.log(total_cash);
                            if (response.res.product.length) {
                                // 注释掉res
                                $(context.total_cash).text(total_cash)
                                context.showNeeds(res);
                            } else {
                                // else if ('888' == response.code) {
                                //     layer_msg(response.msg)
                                // } else if ('990' == response.code) {
                                //     layer.open({
                                //         content: "订单信息为空",
                                //         btn: '确定'
                                //     });
                                // $(context.product_list).html('<p style="text-align: center;margin-top: .9rem">订单信息为空</p>')
                                // $(context.front_next).css("display", "none");
                            }
                        } else {
                            layer_msg(response.msg)
                        }
                    },
                    error: function() {
                        layer_msg('返回数据出现异常');
                    }

                })
                //            debugger;

            },
            //添加订单数据到列表
            /**
             * [description]
             * @param  {[type]} index    [提供给翻页使用]
             * @param  {[type]} response [响应数据]
             * @return {[type]}          [description]
             */
            showNeeds: function(response) {
                console.log(response);
                var context = this;
                //格式化时间
                // $(context.front_next).attr('data-total', response.total);
                swapPage(response);

                function getTime(seconds) {
                    //                seconds.toString();
                    var arr = seconds;
                    console.log(arr)
                    var date = new Date(arr);

                    var month = date.getMonth();
                    var hour = date.getHours();
                    var minutes = date.getMinutes();
                    var seconds = date.getSeconds();
                    month += 1;
                    //                date.setTime(seconds);
                    date.getFullYear();
                    date.getDate();
                    if (hour < 10) {
                        hour = "0" + hour
                    }
                    if (minutes < 10) {
                        minutes = "0" + minutes
                    }
                    if (seconds < 10) {
                        seconds = "0" + seconds
                    }

                    console.log(date.getFullYear() + '年' + month + '月' + date.getDate() + '日 ' + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds());
                    return date.getFullYear() + '年' + month + '月' + date.getDate() + '日 ' + hour + ":" + minutes + ":" + seconds;
                }
                //翻页
                function swapPage(response) {
                    var li = '';
                    var len = response.length;
                    //订单状态判断
                    if (!len) {
                        alert('当前用户订单为空');
                        return;
                    }
                    var order_status = {};
                    console.log(response);
                    console.log('-------------------------------------')
                    for (var i = 0; i < len; i++) {
                        // var page = Number(index) + Number(i);
                        //                    console.log(response[i].orderTime);
                        li +=
                            `<li>
                            <img class="pro-img" src="${response[i].src_bill}" alt="">
                            <ul class="pro-ul">
                                <li><span>产品名称：</span><span>${response[i].name_bill}</span></li>
                                <li><span>预存金额：</span><span>${response[i].pre_bill}</span></li>
                                <li><span>套餐金额：</span><span>${response[i].pack_bill}</span></li>
                            </ul>
                            <a href="mycode.html" class="pro-cash">营销二维码</a>
                        </li>`;
                    }
                    $(context.product_list).html(li);

                }
            },
            btnclick: function() {
                //            点击左边
                var context = this;

                $(context.turn_page_fr).click(function(e) {
                    e.preventDefault();
                    myScroll.scrollTo(0, 0, 300, 0);
                    var index_fr = Number($(context.turn_page_fr).attr('data-index'));
                    var index_th = Number($(context.turn_page_th).attr('data-index'));
                    var res = JSON.parse(sessionStorage.getItem('res'));
                    if (!Number($(context.turn_page_fr).attr('data-index'))) {
                        layer_msg('没有上一页了')
                    } else {
                        context.getNeeds(index_fr, res);
                        $(context.turn_page_fr).attr('data-index', index_fr - 1);
                        $(context.turn_page_th).attr('data-index', index_th - 1);
                    }
                })
                //点击右边
                $(context.turn_page_th).click(function(e) {
                    // e.preventDefault();

                    myScroll.scrollTo(0, 0, 1000, 0)
                    e.preventDefault();
                    var index_fr = Number($(context.turn_page_fr).attr('data-index'));
                    var index_th = Number($(context.turn_page_th).attr('data-index'));
                    //            todo    返给我总共的数据条数
                    var res = JSON.parse(sessionStorage.getItem('res'));
                    var next = $(context.turn_page_th).attr('data-index');
                    var total = $(context.front_next).attr('data-total');
                    console.log(total - (next - 1) * 5);
                    if ((total - (next - 1) * 5) > 0) {
                        context.getNeeds(index_th, res);
                        $(context.turn_page_fr).attr('data-index', index_fr + 1);
                        $(context.turn_page_th).attr('data-index', index_th + 1)
                    } else {
                        layer_msg('没有下一页了')
                    }
                })
            }

        }
        bes_poster.init();
    </script>
</body>

</html>
